<template>
	<!-- 20221104 -->
	<view class="block-withdraw-type-cn">
		<!-- 组件内容 -->
		<view class="cn-content">
			<view class="padding-lr-30">
				<radio-group class="width-100p" @change="radioChange">
					<label class="width-100p" v-if="type.includes('weixin')">
						<view class="height-100 flex align-center justify-between">
							<view class="flex">
								<text class="icon tyIcon-wxpay text-34 text-wechat"></text>
								<view class="margin-left-20 text-28">微信零钱</view>
								<view class="margin-left-15 flex align-center"
									@click="go(bindWxPayUrl)">
									<view class="text-24 text-main">{{isBindWxPay  ? '已绑定微信账户，去修改' : '未绑定微信账户，请前往绑定'}}</view>
									<text class="tyIcon-arrow-right text-26 text-main"></text>
								</view>
							</view>
							<view>
								<radio value="1" :checked="selected == 1" :color="color" style="transform:scale(0.7)" />
							</view>
						</view>
					</label>
					<label class="width-100p" v-if="type.includes('alipay')">
						<view class="height-100 flex align-center justify-between">
							<view class="flex align-center">
								<text class="icon tyIcon-alipay text-34 text-alipay"></text>
								<view class="margin-left-20 text-28">支付宝余额</view>
								<view class="margin-left-15 flex align-center"
									@click="go(bindAliPayUrl)">
									<view class="text-24 text-main">{{isBindAliPay ? '已绑定支付宝账户，去修改' : '未绑定支付宝账户，请前往绑定'}}</view>
									<text class="tyIcon-arrow-right text-26 text-main"></text>
								</view>
							</view>
							<view @tap="aliPayClick">
								<radio value="2" :checked="selected == 2" :disabled="!isBindAliPay" :color="color" style="transform:scale(0.7)" />
							</view>
						</view>
					</label>
				</radio-group>
			</view>
		</view>
		<!-- 组件浮层 -->
		<view class="cn-layer">
			
		</view>
	</view>
</template>

<script>
	import common from '@/components/hzjc/utils/common.js';
	export default {
		props: {
			// 提现方式
			type: {
				type: Array,
				default: ['weixin', 'alipay']
			},
			// 选中提现方式
			selected: {
				type: [String, Number],
				default: 1
			},
			// 是否已经绑定到支付宝
			isBindAliPay: {
				type: Boolean,
				default: true
			},
			// 绑定支付宝页面连接
			bindAliPayUrl: {
				type: String,
				default: '/pages/user/config/alipay'
			},
			// 是否已经绑定到支付宝
			isBindWxPay: {
				type: Boolean,
				default: true
			},
			// 绑定支付宝页面连接
			bindWxPayUrl: {
				type: String,
				default: '/pages/user/config/wxpay'
			},
		},
		data() {
			return {
				color: common.mainColor()
			}
		},
		methods: {
			/** 
			 * 切换提现方式
			 * @param {Object} e
			 */
			radioChange(e) {
				this.$emit("update:selected", e.detail.value)
			},
			
			/**
			 * 点击支付宝提现
			 * @date 2022-11-04
			 */
			aliPayClick(){
				if(!this.isBindAliPay){
					common.toast('请先去绑定支付宝信息')
				}
			}
		}
	}
</script>

<style scoped>

</style>
